<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <script text="javascript">
        function recargar() {
            //se activa el método alert luego de 2 segundos
            //setTimeout("alert('Pasaron 2 segundos!')",2000); 10000
            setTimeout('document.location.reload()', 1000);
        }

    </script> 
    <ui:composition template="/template.xhtml">

        <ui:define name="body">
            <h:form id="frmEncarga" >
                <h:panelGroup id="messagePanel" layout="block">
                    <h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/>
                </h:panelGroup>
                <p:panel header=" Registro de Encargaturas Jefaturales"  >
                    <h:panelGroup >

                        <p:dataTable value="#{movEncargaController.lista}" var="item"  widgetVar="expTable"  paginator="true" 
                                     rowKey="#{item.idMovEncar}" selection="#{movEncargaController.movencarga}" selectionMode="single" id="dataTable"
                                     >
                            <f:facet name="header" >  
                                Movimiento &nbsp;de &nbsp; las  &nbsp;Encargaturas &nbsp; Jefaturales 
                            </f:facet> 
                            <p:column width="20" style="text-align: center; font-size: 11px; ">
                                <f:facet name="header">
                                    <h:outputText value="Sec." />
                                </f:facet>
                                <h:outputText value="#{item.idMovEncar}"/>
                            </p:column>
                            <p:column width="210" style="text-align: left; font-size: 11px;" >
                                <f:facet name="header"  class="titu-center"  >
                                    <h:outputText value="Trabajador" />
                                </f:facet>
                                <h:outputText value="#{item.trabajador.apePat} #{item.trabajador.apeMat} #{item.trabajador.nombres} ">

                                </h:outputText>
                            </p:column> 
                            <p:column width="220" style="text-align: left; font-size: 11px; ">
                                <f:facet name="header">
                                    <h:outputText value="Area Responsable"/>
                                </f:facet>
                                <h:outputText value="#{item.area.nombre}"/>
                            </p:column>
                            <p:column width="280" style="text-align: left; font-size: 11px; ">
                                <f:facet name="header">
                                    <h:outputText value="Jefatura"/>
                                </f:facet>
                                <h:outputText value="#{item.cargoRespon.nombre}"/>
                            </p:column>

                            <p:column width="62" style="text-align: center; font-size: 11px; ">
                                <f:facet name="header">
                                    <h:outputText value="Fecha Inicio"/>
                                </f:facet>
                                <h:outputText value="#{item.fechaInicio}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>
                            </p:column>
                            <p:column width="53" style="text-align: center; font-size: 11px; ">
                                <f:facet name="header">
                                    <h:outputText value="Fecha Fin"/>
                                </f:facet>
                                <h:outputText value="#{item.fechaFin}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>
                            </p:column >

                            <p:column width="198">
                                <f:facet name="header">
                                    <h:outputText value="&nbsp; Opciones"/>
                                </f:facet>
                                <p:commandButton value="Ver" icon="ui-icon-search" oncomplete="expSelecDialog.show()" update=":frmDetalle"    />
                                <h:outputText value=" "/>
                                <p:commandButton update=":confirmEditar" value="Editar" actionListener="#{movEncargaController.getMovEncarga(item.idMovEncar)}"
                                                 oncomplete="dlgEditar.show();" icon="ui-icon-arrowrefresh-1-w"   > 
                                    <f:setPropertyActionListener value="#{item}" target="#{movEncargaController.movencarga}" />
                                </p:commandButton> 
                                <h:outputText value=" "/>
                                <p:commandButton value="Elimina" update=":confirmDelete" oncomplete="deleteDialog1.show()">
                                    <f:setPropertyActionListener value="#{item}" target="#{movEncargaController.movencarga}" />
                                </p:commandButton>
                            </p:column>
                            <f:facet name="footer">  
                                <p:commandButton value="Nueva Encargatura" update=":frmNuevo"  icon="ui-icon-disk" actionListener="#{movEncargaController.prepareCreateEncarga()}"
                                                 oncomplete="dlgNuevo.show();">
                                </p:commandButton>

                                &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <h:commandButton actionListener="#{movEncargaController.PDFov}" title="Reporta Movimiento de Encargatura" image="/resources/img/print.PNG" value="Encargaturas" disabled="#{usuarioController.condicion2()}"   />

                            </f:facet>  
                        </p:dataTable>
                    </h:panelGroup>
                    <br />
                </p:panel>

                <br />
            </h:form>
            <!-- Dialog Elimina Encargatura -->  
            <p:confirmDialog id="confirmDelete" header="Confirmar Eliminación " widgetVar="deleteDialog1" severity="alert" showEffect="fade" appendToBody="true" 
                             hideEffect="fade" closeOnEscape="true"  message="¿Eliminará  Encargatura  ? '"
                             style="font-size: 18px; color: red;"  >
                <h:form>
                    <h:panelGrid id="display" columns="2" cellpadding="4"  style="font-size: 11px;">
                        <h:outputText value="Código" style="font-size: 13px; color: red;" />
                        <h:outputText value="#{movEncargaController.movencarga.idMovEncar}" style="font-size: 18px; font-weight: 700; color: red;" />
                        <h:outputText value="Trabajador(a)" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.trabajador.apePat} #{movEncargaController.movencarga.trabajador.apeMat} #{movEncargaController.movencarga.trabajador.nombres} " style="color: blue;width: 200px;" readonly="true"/>
                        <h:outputText value="Area Responsable" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.area.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Jefatura" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.cargoRespon.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Fecha de Inicio" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaInicio}" style="color: blue; width: 70px;" readonly="true">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>
                        <h:outputText value="Fecha de Termino" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaFin}" style="color: blue;width: 70px;" readonly="true">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>

                    </h:panelGrid>
                    <p:separator/>
                    <center>
                        <p:commandButton id="accept" value="Eliminar" update=":confirmDelete,:frmEncarga" oncomplete="deleteDialog1.hide();"
                                         actionListener="#{movEncargaController.eliminaEncarga()}" ajax="true" > 
                        </p:commandButton>
                    </center>
                </h:form>
            </p:confirmDialog>     

            <!--h:form id="frmEditar"-->
            <!--  ************************Dialog de confirmacion de Edicion de Expediente ****************************  appendToBody="false TRUE"   **-->            
            <p:dialog  id="confirmEditar" modal="true"  header="Editar Encargatura" appendTo="@(body)" closeOnEscape="true" widgetVar="dlgEditar" 
                       resizable="false" showEffect="fade" hideEffect="explode" width="500" >
                <h:form>
                    <h:panelGrid id="pgEditar"   columns="2" cellpadding="6"  cellspacing="1" style="margin: 0 auto;">

                        <h:outputText value="Nº Registro  " style="font-size: 15px; color: blue;"/>
                        <h:outputText value="#{movEncargaController.movencarga.idMovEncar}"  style="width: 110px; color: red; font-size: 16px;"  />

                        <h:outputText value="Trabajador" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="trabajador" value="#{movEncargaController.movencarga.trabajador}"  style="font-size: 12px; width: 290px;  color: #4e6a71;" requiredMessage="Seleccionar Trabajador">
                            <f:selectItems value="#{trabajadorController.itemsAvailableSelectOne}"  />
                        </h:selectOneMenu>  

                        <h:outputText value="Area Responsable" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="AreaResp" value="#{movEncargaController.movencarga.area}"  style="font-size: 12px; width: 270px;" required="true" requiredMessage="Seleccionar Area">
                            <f:selectItems value="#{areaController.itemsAvailableSelectOne}"/>
                        </h:selectOneMenu>                        

                        <h:outputText value="Jefatura" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="jefatura" value="#{movEncargaController.movencarga.cargoRespon}" style="font-size: 12px; width: 270px;" required="true" requiredMessage="Seleccionar Jefatura">
                            <f:selectItems value="#{cargoResponController.itemsAvailableSelectOne}"/>
                        </h:selectOneMenu>
                        <h:outputText value="Fecha Inicio" style="color: blue; font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaInicio}" style="width: 90px;" required="true" >
                            <f:convertDateTime pattern="MM/dd/yyyy" />
                        </p:inputText>

                        <h:outputText value="Fecha Fin " style="color: blue; font-size: 11px;"/>
                        <p:inputText value="#{movEncargaController.movencarga.fechaFin}" style="width: 90px;" required="true" >
                            <f:convertDateTime pattern="MM/dd/yyyy" />
                        </p:inputText>

                    </h:panelGrid>     

                    <center> 
                        <p:commandButton id="accept"  value="Grabar" update=":confirmEditar,:frmEncarga" oncomplete="dlgEditar.hide();"  
                                         action="#{movEncargaController.update()}" ajax="true" onclick="recargar();"  icon="ui-icon-disk" 
                                         >
                        </p:commandButton>

                    </center>

                </h:form>  
            </p:dialog> 

            <!-- Form Detalle de la Derivación -->  
            <h:form id="frmDetalle" >  
                <p:dialog header=" Detalle de Encargatura Seleccionada" closeOnEscape="true" widgetVar="expSelecDialog" resizable="false" width="480"  
                          showEffect="fade" hideEffect="explode" >
                    <h:panelGrid id="display" columns="2" cellpadding="4"  style="font-size: 11px;" >
                        <h:outputText value="Código" style="font-size: 13px; color: red;" />
                        <h:outputText value="#{movEncargaController.movencarga.idMovEncar}" style="font-size: 18px; font-weight: 700; color: red;" />
                        <h:outputText value="Trabajador(a)" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.trabajador.apePat} #{movEncargaController.movencarga.trabajador.apeMat} #{movEncargaController.movencarga.trabajador.nombres} " style="color: blue;width: 200px;" readonly="true"/>
                        <h:outputText value="Area Responsable" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.area.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Jefatura" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.cargoRespon.nombre}" style="color: blue; width: 270px;" readonly="true"/>
                        <h:outputText value="Fecha de Inicio" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaInicio}" style="color: blue; width: 70px;" readonly="true">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>
                        <h:outputText value="Fecha de Termino" style="font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaFin}" style="color: blue;width: 70px;" readonly="true">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>
                    </h:panelGrid>
                </p:dialog>
            </h:form> 

            <!-- Formulario Nueva Encargatura -->  
            <p:dialog id="confNuevo" modal="true" header="Nueva Encargatura"  closeOnEscape="true" widgetVar="dlgNuevo" resizable="false" showEffect="fade" hideEffect="explode" appendTo="@(body)" >
                <h:form id="frmNuevo">
                    <p:growl id="growl" showDetail="true" sticky="true" />  
                    <!--   -->
                    <h:panelGrid id="pgNuevo"  columns="2" cellpadding="2"  cellspacing="7" style="margin: 0 auto;">

                        <h:outputText value="Trabajador" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="trabajador" value="#{movEncargaController.movencarga.trabajador}"  style="font-size: 12px; width: 290px;  color: #4e6a71;" requiredMessage="Seleccionar Trabajador">
                            <f:selectItems value="#{trabajadorController.itemsAvailableSelectOne}"  />
                        </h:selectOneMenu>  

                        <h:outputText value="Area Responsable" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="AreaResp" value="#{movEncargaController.movencarga.area}"  style="font-size: 12px; width: 270px;" required="true" requiredMessage="Seleccionar Area">
                            <f:selectItems value="#{areaController.itemsAvailableSelectOne}"/>
                        </h:selectOneMenu>                        

                        <h:outputText value="Jefatura" style="color: blue; font-size: 11px;" />
                        <h:selectOneMenu id="jefatura" value="#{movEncargaController.movencarga.cargoRespon}" style="font-size: 12px; width: 270px;" required="true" requiredMessage="Seleccionar Jefatura">
                            <f:selectItems value="#{cargoResponController.itemsAvailableSelectOne}"/>
                        </h:selectOneMenu>
                        <h:outputText value="Fecha Inicio" style="color: blue; font-size: 11px;" />
                        <p:inputText value="#{movEncargaController.movencarga.fechaInicio}" style="width: 90px;" required="true" >
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>
                        <h:outputText value="Fecha Fin " style="color: blue; font-size: 11px;"/>
                        <p:inputText value="#{movEncargaController.movencarga.fechaFin}" style="width: 90px;" required="true" >
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:inputText>
                    </h:panelGrid> 
                    <p:separator />
                    <br />
                    <center>
                        <p:commandButton id="cnew"   onclick="recargar();" value="Guardar" update=":frmEncarga"  oncomplete="dlgNuevo.hide();" icon="ui-icon-disk" 
                                         action="#{movEncargaController.grabaEncarga()}" ajax="true" />  
                    </center>

                </h:form>

            </p:dialog>


        </ui:define>
    </ui:composition>

</html>
